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Javascript 导 学 
这 本 书 将 教 你 Javascript 编 程 的 相关 基础 。 不 管 你 是 菜 乌 还 是 一 个 有 经 验 的 程序 
猿 ， 这 本 书 是 为 任何 想 学 习 Javascript 编 程 的 人 而 准 各 的。 


JavaScript (简称 JS ) 是 一 种 能 够 让 网 页 响应 用 户 交 互 的 编程 语言 。 它 产生 于 1995 
年 ， 现 已 是 当下 最 火 并 且 使 用 最 广泛 的 语言 之 一 。 

Note: 这 本 开源 的 书 来 自 GitBook 的 Learn Javascript。 

自我 说 明 : 这 是 我 第 一 次 进行 开源 翻译 项 目 ， 现 在 是 一 个 人 ， 也 欢迎 有 其 他 人 加 入 
这 个 项 目 。 还 希望 大 家 指出 翻译 错误 的 地 方 ， 有 问题 可 以 在 GitHub 中 提出 。 最 后 ， 
感谢 本 书 作者 Gitbook 公 司 提供 这 套 教程 。 


编程 基础 
在 第 一 章 ， 我 们 将 学 习 Javascript 的 编程 基础 。 


编程 其 实 就 是 敲 代 码 。 就 像 一 本 书 是 包 仿 章节， 段落， 句子 ， 短 语 ， 单 词 最 终 由 字 
母 组 成 的 一 样 ， 程 序 也 能 被 切 分 成 一 块 块 更 小 的 部 分 。 对 于 程序 ， 最 重要 的 声明 。 
声明 等 同 于 书 中 的 句子 。 单 独 看 ， 句 子 有 结构 和 议题 。 但 脱离 了 上 下 文 ， 它 却 没有 
该 有 的 意义 。 


声明 ， 即 非 正式 的 (广泛 的 ) 被 认为 就 是 一 行 代码 。 因 为 声明 通常 被 写 在 同一 行 。 正 
是 这 样 ， 程 序 代码 通常 从 上 到 下 ， 从 左 往 右 读 。 你 可 能 会 惊讶 什么 是 代码 (也 就 是 源 
代码 )。 这 是 个 广泛 的 术语 ， 指 的 可 以 是 整个 程序 也 可 以 是 其 中 最 小 的 部 分 。 因 此 ， 
一 行 代码 简单 的 说 就 是 一 行 你 的 程序 。 


举 个 例子 : 


Var hello = "Hello"; 
var world = "World"; 


Message equals "Hello World" 
] 


Var message = hello + " " + world; 


这 段 代码 能 被 解释 器 执行 ， 并 且 按 照 正确 的 顺序 来 执行 。 
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六 释 
注释 不 会 被 解释 执行 ， 注 释 被 用 来 将 代码 解释 给 其 他 程序 员 看 ， 或 者 是 为 了 对 代码 
作用 的 简单 描述 。 因 此 提高 代码 的 可 读 性 。 
在 Javascript 中 ， 可 以 使 用 两 种 方式 进行 注释 : 
。 单行 注释 用 // : 


// 这 是 注释 ， 将 被 解释 器 忽略 
var a = "this is a variable defined in a statement"; 


。 多 行 注释 用 /* 开始 ， 用 */ 结尾 : 


7 

这 是 多 行 注 释 ， 

将 被 解释 器 忽略 

BE 

var a = "this is a variable defined in a statement"; 


Exercise 
将 作者 的 话 变 成 注释 


Mark me as a comment 
or I']l1 throw an error 





注释 6 


= 
变量 


真正 理解 编程 的 第 一 步 是 回顾 代数 知识 。 如 果 你 记得 上 学 时 鲁 学 的 代数 ， 起 初 应 该 
如 下 。 


当 你 引入 不 止 一 个 更 灵活 的 的 条 件 -- 你 正在 使 用 变量 : 


Xx+y=8 


你 可 以 改变 x 和 y 的 值 ， 表 达 式 依然 成 立 : 


X= 4 
y=4 
或 

X= 3 
y= 5 


编程 语言 都 是 如 此 。 在 编程 中 ， 变 量 是 可 改变 值 的 容器 。 变 量 可 以 保存 各 种 类 型 的 
值 或 计算 结果 。 变 量 由 变量 名 、 值 构成 ， 通 过 中 间 的 等 号 (=) 将 他 们 分 开 。 变 量 名 可 
以 是 任何 字母 或 者 单词 ， 但 要 记 住 其 中 有 一 些 限 制 ， 比 如 某 些 是 有 特殊 功能 的 关键 


3 
TPjo 


我 们 来 看 看 这 是 如 何在 Javascript 中 工作 的 ， 以 下 代码 定义 了 两 个 变量 ， 计 算 两 个 
之 和 将 其 保存 在 第 三 个 变量 中 。 


Var x = 5) 
var y = 6) 
var result = x + y; 


t 导 学 
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数据 类 型 


计算 机 很 复杂 并 且 可 以 使 用 更 复杂 的 变量 而 不 仅仅 只 是 数字 。 数 据 类 型 就 出 现 了 。 
变量 的 出 现 伴 随 着 几 种 类 型 ， 不 同 的 语言 支持 不 同 的 类 型 。 


最 常见 的 类 型 有 : 


。 数字 
o 浮 点 数 : 一 个 数字 , 例如 1.21323, 4, -33.5, 100004 或 0.123 
o 整数 : 一 个 数字 例如 1, 12, -33, 140 不 可 以 是 1.233 
。 字符 串 : 一 行文 本 比如 "boat", "elephant" or "damn, you are tallt" 
。 布尔 : 只 能 表示 真 (true) 或 假 (false) 
e。 数组 : 一 个 数值 的 集合 比如 : 1,2,3,4,'| am bored now' 
。 对 象 : 一 种 更 复杂 的 对 象 的 表现 
e null: 一 个 空 值 变量 ， 它 可 以 为 各 种 可 能 的 类 型 。 
undefined: 一 个 未 定义 值 ， 产 生 于 当 你 使 用 一 个 对 象 的 不 存在 属性 或 一 个 未 赋 
值 的 变量 时 。 
JavaScript 是 一 种 能 类 型 ”语言 , 这 意味 着 你 不 需要 明确 的 声明 变量 的 数据 类 型 。 
你 只 需 用 var 关键 词 来 暗示 你 正在 声明 一 个 变量 ， 解 释 器 会 从 上 下 文 (和 引号 ) 得 
你 用 的 是 什么 数据 类 型 ， 


Exercise 
用 关键 词 "var 创建 一 个 名 为 `a` 的 变量 . 





程序 猿 经 常 需 要 将 等 价 的 值 关 联 起 来 。 这 时 需要 用 到 等 号 。 


最 基础 的 等 性 运算 符 是 == 。 这 个 运算 符 可 以 判断 两 个 变量 是 否 相等 ， 即 使 不 是 


举 个 例子 ， 假 设 : 


var foo = 42; 

var bar = 42; 

var baz = "42"，; 
var qux = "life",; 


foo == bar 将 判定 为 true ， 而 baz == qux 将 判定 为 false 。 然 而 ， 尽 
管 foo 和 baz 是 不 同类 型 ， foo == baz 也 将 判定 为 true 。 == 等 性 运 
算 符 在 判断 等 价 性 之 前 会 党 试 强制 将 操作 数 转 为 相同 类 型 。 这 与 === 全 等 运算 符 
不 同 。 


=== 全 等 运算 符 判 断 两 个 变量 是 否 类 型 和 值 都 相等 。 在 这 种 情况 下 ， foo === 
bar 仍然 是 true ,而 foo === baz 将 为 ”false . baz === qux 仍 为 
false . 


AL/ mi 

数字 

JavaScript 的 数字 只 有 一 种 类 型 - 64 位 浮 点 数 。 这 类 似 于 Java 的 'double'。 不 同 于 
其 他 编程 语言 ， 这 里 不 需要 区 分 整数 类 型 ， 所 以 1 和 1.0 是 相同 值 。 

在 这 章节 ， 我 们 将 学 习 如 何 创 建 数字 和 使 用 运算 符 ( 比 如 加 减 )。 
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创建 
创建 一 个 数字 很 容易 ， 创 建 任 何 类 型 都 只 需要 使 用 关键 词 var 。 
数字 可 以 被 创建 来 自 一 个 常量 : 


// 这 是 浮 点 型 : 
Va a = 


// 这 是 整 型 ; 


var b = 10; 
或 来 自 另 一 个 变量 : 

var a = 2,，; 

var b = a; 


Exercise 


创建 一 个 值 为 `10` 的 变量 x ， 创建 一 个 值 等 于 `a' 的 变量 y 。 


var a = 11,; 
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基本 运算 符 


你 可 以 对 数字 使 用 一 些 简单 的 数学 运算 符 比 如 : 


e。 加 : c=a+t+b 
e 减 ;: C=a-b 
e。 乘 : c=a*b 
。 除 : c =a/b 


你 可 以 像 在 数学 中 一 样 ， 使 用 括号 分 隔 进行 分 隔 比 如 : c= (a/b)+d 


Exercise 
创建 一 个 变量 `X ， 它 的 值 为 "a 和 `b` 之 和 再 被 `"c` 除 ， 最 后 乘 上 *d.. 


a = 2034547; 
b = 1.567; 
GC 
d 


6758 .768; 
45084; 
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高 级 运算 稚 
一 些 高 级 的 运算 符 可 以 这 样 用 ， 上 比如 : 


。 求 余 (除法 的 余数 ): x = y % 2 
e。 累加 :让 a=5 
o C= a++ 


, 结果 :c=5 和 a=6 
, 结果 :c=6 和 a=6 


o c= a-- ,结果 :c=5 和 a=4 
o c= --a ,结果 :c=4 和 a=4 


定义 一 个 变量 `c 作为 自 减 变量 x`" 对 3 的 模 。 


var x = 10; 
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字符 串 


JavaScript 的 字符 串 与 其 他 高 级 语言 字符 串 的 实现 类 似 。 这 表示 文本 基于 消息 和 数 
据 。 


在 这 章节 将 涉及 一 些 基 础 。 关 于 如 何 创 建新 的 字符 串 和 常见 的 一 些 字符 串 人 处 理 。 以 


是 是 一 个 例子 : 


"Hello World" 
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创建 
你 可 以 在 Javascript 中 ， 通 过 单 引号 或 双 引 号 定义 字符 串 : 


// 可 以 用 单 引号 
var str = 'Our Jovely string'; 


// 也 可 以 用 双 引 号 
var otherStr = "Another nice string"; 


在 Javascript 中 ， 字 符 串 可 以 使 用 UTF-8 编 码 : 


"中 文 espafiol English 信守 xl portugués TSNT pyccknii 日 本 语 oooo 


二 说 





注意 : 字符 串 不 能 进行 减 ， 乘 或 除 的 运算 。 


Exercise 


创建 一 个 名 为 “str 的 变量 ， 值 为 “"abc” 。 
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连接 


连接 同时 涉及 两 个 或 以 上 字符 串 ， 创 建 了 一 个 组 合 这 些 原 始 数据 的 更 长 的 字符 串 。 
在 Javascript 中 使 用 + 运算 符 。 


var bigStr = 'Hi ' + 'JS strings are nice ' + 'and ' + 'easy to ad 


二 





Exercise 
连接 不 同 的 名 字 ， 这 样 变量 `fullIName'` 就 包含 了 John 的 全 名 。 


var firstName = "John"; 


var lastName = "Smith"; 


var fullName = 
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长 度 
在 Javascript 中 通过 使 用 .length 很 容易 知道 字符 串 中 有 多 少 字母。 


// 使 用 .length 
var size = 'Our lovely string'.length,; 


Exercise 


在 变量 `size` 中 储存 `str 的 长 度 。 


var Str = "Hello Wor]ld"; 


var size = 





条 件 远 辑 
条 件 语句 可 以 用 来 测试 。 条 件 判 断 在 编程 中 非常 重要 ， 上 比如 : 


首先 ， 无 论 程序 运行 使 用 什么 数据 ， 所 有 的 条 件 都 能 被 用 来 确定 程序 是 否 正 常 。 如 
果 盲 目的 相信 数据 ， 你 将 陷入 程序 出 错 的 麻烦 。 如 果 测 试 有 效 并 且 所 需 信 息 格式 正 
确 ， 程 序 就 不 会 出 错 ， 还 会 变 得 更 稳定 。 采 取 这 种 预防 措施 的 行为 被 称 作 防 御 性 编 
程 。 

另 一 种 条 件 判 断 的 作用 就 是 分 文 。 你 可 能 已 经 接触 过 分 文 图 ， 比 如 填写 表格 时 。 基 
本 上 这 指 的 是 依赖 i 条件 语句 执行 不 同 的 代码 分 支 。 


在 这 个 章节 ， 我 们 将 会 学 习 Javascript 中 条 件 逻 辑 的 基础 。 
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If 


最 简单 的 条 件 判 断 是 if 语句 ， 语 法 是 if(condition){ do this .. } 。 条 件 判断 
为 真 ， 才 执行 分 支 中 的 代码 。 举 个 字符 串 的 例子 : 


Var country = 'France'; 
Var Weather ; 

Var food 

Var currency 


if(country === 'England') { 
weather = 'horrible'; 
food = 'filling'; 
currency = 'pound sterling'; 
} 
if(country === 'France') { 
weather = 'nice'; 
food = 'stunning, but hardly ever vegetarian',; 
currency = 'funny, small and colourful'; 
} 
if(country === 'Germany') { 
weather = 'average',; 
food = 'wurst thing ever'; 
currency = 'funny, small and colourful',; 
} 
Var message = 'this is ' + Country + ', the weather is ' + 


weather + ', the food is ' + food + ' and the ' + 
'currency is ' + currency; 


注意 : 条 件 判 断 可 以 庶 套 。 





填写 "name ` 的 值 ， 验 证 条 件 判 断 。 
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var name = 
if (name === "John") { 
} 
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Else 


当 第 一 个 条 件 语句 不 成 立时 ， else 语句 将 被 执行 。 如 果 你 想 要 在 特殊 条 件 下 才 
返回 一 个 值 ， 这 非常 有 效 : 


var umbrellaMandatory; 


if(country === 'England' ){ 
umbrellaMandatory = true; 
} else { 


umbrellaMandatory = false; 


else 语句 可 以 和 另 一 个 if 语句 结合 。 改 造 一 下 上 面 的 例子 : 


if(country === 'England') { 

} ee === 'France') { 
} ee === 'Germany') { 
} 


Exercise 


填写 "name 的 值 ， 验 证 `else. 语句 。 


Var Name = 


if (name === "John") { 


} else if (name === "Aaron") { 
// Valid this condition 
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比较 运算 符 


把 焦点 放 在 条 件 判 断 部 分 : 

TOUntry rancer 

} 
变量 country 后 面 跟着 的 三 个 等 号 ( === ) 是 条 件 判断 部 分 。 三 个 等 号 测试 是 否 
变量 country 和 France 值 与 类 型 ( String ) 相 同 。 你 也 可 以 用 两 个 等 号 来 测 


试 ， 比 如 if (x == ， 在 var x = 5; 或 var x = &quot;5&quot;; 情况 
下 都 返回 真 。 rm 本 rr 。 比 较 推 荐 你 经 常 去 党 试 比 较 三 
个 等 号 ( === 和 !== ) 和 两 个 等 号 ( == 和 != ) 的 区 别 。 


其 他 条 件 判断 的 测试 : 


e x &gt; a :isx biggerthan a? 
&lt; a :isx less than a? 
&lt;= a :is x less than or equal to a? 


xX 
xX 
e x &gt;=a :isx greater than or equalto a? 
x != a :isxnota? 

xX 


: does x exist? 


Var Xx 


Var a 





逻辑 比较 


为 了 避免 if-else 麻 烦 ， 可 以 利用 一 种 简单 的 逻辑 比较 。 


var topper = (marks > 85) ? "YES"”: "NO"; 


在 上 述 例子 中 ， ? 是 逻辑 运算 符 。 上 述 源码 表示 如 果 marks 的 值 大 于 85 即 marks 
&gt; 85 ， 则 topper = YES ;否则 topper = NO 。 基 本 上 ， 如 果 比 较 条 件 
为 真 ， 赋 第 一 个 参数 的 值 ， 否 则 赋 的 二 哥 参 数 的 值 。 
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条 件 连接 


此 外 ， 你 可 以 用 "or 或 “and” 语句 连接 不 同 的 条 件 判断 ， 可 以 分 别 的 测试 是 否 存在 
一 个 为 真 或 同 为 真 。 


在 Javascript 中 , “or 可 以 被 写成 || ， “and"” 可 以 被 写成 &amp;&amp; 。 


比如 你 想 要 测试 x 的 值 是 否 在 10 到 20 之 间 ， 你 可 以 用 上 述 的 方法 : 


if(x > 10 && x < 20) { 


如 果 你 想 要 确认 country 是 “England” 或 “Germany”: 


if(country === 'England' || country === 'Germany') { 


注意 : 就 像 对 数字 的 运算 符 ， 条 件 可 以 用 括号 来 分 组 ， 比如: if ( (name === 
&quot;Johng&quot; || name === &quot;Jennifer&quot;) &amp;&amp; 


country === &quot;France&quot;) 。 





填写 两 个 条 件 让 仅 当 name 为 "John" ，country 为 "England"， 
primaryCategory 才 等 于 `"E/J" ， 仅 当 name 为 John" 或 country 为 
"England"， `secondaryCategory. 才 等 于 `"E/J" 。 
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var name = "John'”; 
var country = "England 
var primaryCategory, secondaryCategory; 


If ( /* Fill here */ ){ 
primaryCategory = "E/J"; 


b 

if ( /* Fill here */ ){ 
secondaryCategory = "E|J"; 

} 
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数组 


数组 是 编程 的 基础 部 分 。 一 个 数组 就 是 一 系列 数据 。 我 们 可 以 储存 许多 数据 在 一 个 
变量 中 ， 这 提高 了 代码 可 读 性 ， 让 人 更 好 理解 代码 。 这 使 相关 数据 传递 到 函数 中 执 
行 更 简单 。 

数组 中 数据 称 为 元 素 。 

这 是 一 个 简单 的 数组 : 


7 了 一 门 ~ IH QO 百 闪 各 册 的 二 替 
// 1，1，2，3，5 机 8 是 效 组 中 的 元 柔 


var numbers = [1, 1, 2, 3, 5, 8]; 
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索引 


若 你 有 一 个 数组 ， 如 何 访 问 想 要 的 特定 元 素 ?索引 出 现 了 。 一 个 下 标 指向 数组 中 
的 一 个 位 置 。 正 如 其 他 大 部 分 语言 ， 索 引退 辑 上 是 一 个 接 一 个 ， 但 要 注意 第 一 个 数 
组 下 标 是 0。 方 括号 [被 用 来 表示 使 用 数组 下 标 。 


// 这 是 字符 串 构 成 的 数组 
var fruits = ["apple", "banana", "pineapple", "strawberry"]; 


// 用 fruits 数 组 中 的 第 二 个 元 素 的 值 赋值 给 变量 banana 
// 记 住 索引 ( 即 下 标 ) 是 从 9 开始 ， 下 标 1 即 第 二 个 元 素 
// 结果 : banana = "banana" 

var banana = fruits[1]; 


Exercise 
定义 变量 使 用 数组 的 索引 


var cars = [ Mazda" ， "Honda", "Chevy", "Ford"] 
var honda = 
var ford = 
var chevy = 
var mazda = 
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从 

状 度 

数组 有 个 属性 称 为 长 度 ， 正 如 字面 意思 ， 这 就 是 数组 的 长 度 。 
Vaneaeay = 2 


// 结果 : 1 = 3 
var 1 = array.length,; 


Exercise 


定义 变量 a 为 数组 的 长 度 


Val vanmmay ee 2 0 5 
var 1 = array.length; 
Var a = 





循环 


循环 是 一 种 变量 在 其 中 不 断 改变 的 重复 状 。 如 果 您 希望 一 表 又 一 表 地 运行 相同 的 代 
码 ， 并 且 每 次 的 值 都 不 同 ， 那 么 使 用 循环 是 很 方便 的 。 


与 其 用 : 


doThing(cars[0]); 
doThing(cars[1]); 
doThing(cars[2]); 
doThing(cars[3]); 
doThing(cars[4]); 


不 如 用 : 


for (var i=0; i < cars.length,; i++) { 
doThing(cars[i]); 
} 


Javascript 导 学 


For 循环 


for 语 句 是 最 简单 的 循环 形式 。 它 的 语法 类 似 if 语 句 ， 只 是 多 了 


刁 


选项 : 
for(condition; end condition; change){ 
do OO TOWN 
来 看 看 如 何 使 用 for 循 环 执行 10 次 相同 的 代码 : 
for(var i = 0; i < 10; 1I= i+ 1){ 


// 执行 这 段 代 码 19 次 


注意 : i = i + 1 也 可 以 写成 i++ . 


Exercise 


使 用 for 循 环 ， 创 建 一 个 “message ` 变量 ， 使 其 值 为 整数 0 到 99 (0, 1, 2, …) 之 
和 。 


Var message = ""， 
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While 循环 
只 要 特殊 条 件 为 真 ，While 循 环 就 一 直 执 行 代 码 块 。 


while(condition)t{ 
// 只 要 条 件 为 真 就 继续 执行 


举 个 例子 ， 以 下 代码 会 一 直 执 行 ， 只 要 变量 i 小 于 5 : 


Valnee =00 X= 
while (i < 5) { 
x=x + "The number is " + i; 


I++ ， 


Do/While 循 环 是 while 循 环 的 变 体 。 这 种 循环 将 先 检查 条 件 是 否 为 真 ， 再 执行 代码 
块 。 它 将 重复 循环 只 要 条 件 为 真 : 


do { 
// 代码 块 被 执行 
} while (condition); 


注意 : 要 注意 避免 如 果 条 件 总 为 真 导致 的 无 限 循环 ! 


Exercise 


使 用 while 循 环 ， 创 建 一 个 "message 变量 ， 保 存 连接 的 整数 ， 仅 当 长 度 小 于 
100。 


Var message = 


TIL, 
了 





While D2 


Javascript 导 学 


Do...While 循环 


do.….while 语 名 创建 的 循环 会 先 执行 语句 直到 条 件 判 断 为 假 。 do… while 的 语法 如 
下 : 


dof{ 
// statement 


} 


while(expression) ;，; 


来 看 看 如 何 使 用 do.. .while 循环 答应 小 于 10 的 数字 : 


var i = 0) 
do { 
document .write(i + " "); 
; // i 增加 1 
} while (i < 10); 


i++ 


注意 : i = i + 1 也 可 以 写成 i++ . 


Exercise 
使 用 do...while 循 环 ， 打 印 小 于 5 的 数字 。 


var i = 0; 
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函数 是 编程 中 功能 最 强大 也 是 最 重要 的 概念 之 一 。 
沙 数 就 像 数学 中 的 函数 ， 有 输入 值 即 参数 ， 返 回 输出 值 。 


Javascript 导 学 


四 1A i 
函数 声明 
如 同 专 量 ， 画 数 必须 被 声明 。 以 下 是 声明 一 个 画 数 double 接受 参数 x 返回 x 


的 两 倍 : 


function double(x) { 
[区 SEE 2 XxX, 


注意 : 上 述 沙 数 可 能 在 声明 之 前 被 引用 。 
函数 在 Javascript 中 也 是 变量 ; 可 以 储存 值 〈 比 如 数字 ， 字 符 串 等 等 ) ， 将 其 作为 
参数 传 给 其 他 男 数 : 


var double = function(x) { 
etunne 2 xX 


}; 


注意 : 上 述 沙 数 没有 可 能 在 声明 之 前 被 引用 ， 就 像 其 他 变量 。 


Exercise 
声明 一 个 `triple` 函数 ， 接 受 一 个 参数 ， 返 回 它 的 三 售 。 





高 阶 图 数 


高 阶 画 数 是 操作 其 他 函数 的 函数 。 举 个 例子 ， 一 个 函数 可 以 将 其 他 画 数 作为 参数 和 |/ 
或 产生 一 个 函数 作 作 为 它 的 返回 值 。 精巧 的 功能 技术 是 非常 强大 的 构造 ， 可 在 
Javascript 或 其 他 高 级 语言 比如 python，lisp 等 中 使 用 。 


我 们 来 创建 两 个 简单 的 函数 ， add_2 和 double ， 和 一 个 高 阶 画 数 map 

。 map 接受 两 个 参数 ， func 和 1list  ( 它 的 声明 因此 

为 map(func, List) ) ， 返 回 一 个 数组 。 func (第 一 个 参数 ) 作 为 函数 将 被 应 用 
到 每 个 数组 1list (第 二 个 参数 ) 的 每 一 个 元 素 中 。 


// 定义 两 个 简单 图 数 

var add 2 = function(x) { 
etUnn X12 

}; 

var double = function(x) { 
Peturmn 2 x 


}; 


// map 接受 两 个 参数 
// func 调用 男 数 


jp7 MSE 数组 中 元 素 值 传递 给 func 
var map = function(func, lJist) £ 
var output=[]; // 输出 list 


for(idx in Jist) { 
output.push( func(list[idx]) ); 
} 


return output,; 





// 使 用 map 将 函数 应 用 于 整个 输入 列表 
// 产生 相应 的 输出 列表 
map(add 2, [5,6,7]) // => [7, 8, 9] 

map(double， [5,6,7]) // => [10, 12, 14] 











上 述 例子 中 的 函数 很 简单 。 然 而 在 作为 参数 传递 给 其 他 函数 时 ， 可 以 使 用 特殊 组 合 
方法 构件 更 复 条 的 函数 。 


举 个 例子 ， 如 果 注 意 到 在 代码 中 平凡 使 用 调用 方法 map(add_2，...) 和 
map(double，...) ， 可 以 创建 两 个 特殊 用 途 的 列表 i 运行 组 合 起 来 的 函数 . 使 用 
画 数 封 装 ， 可 以 如 下 操作 : 


process add 2 = function(list) { 
return map(add 2, list); 


} 


process_ double = function(list) { 
return map(double, list); 


} 
process add 2([5,6,7]) // => [7, 8, 9] 
process_double([5,6,7]) // => [10, 12, 14] 


创建 一 个 buildProcessor 回 数 ， 它 将 函数 func 作为 函数 ， 返 回 一 个 
func 处 理 程序 ， 这 个 画 数 将 列表 作为 输入 应 用 到 func 。 


// 国 数 产 生 一 系列 多 理 程序 
var buildProcessor = function(func) { 





var process_func = function(list) { 
return map(func, list); 


} 
return process_func; 
} 
// 调用 buildProcessor 返 回 一 个 调用 输入 列表 的 函数 








// 使 用 buildProcessor 产 生 add_ 2 process_double : 
process _ add 2 = buildProcessor(add 2); 
process_ double = buildProcessor(double); 


process add 2([5,6,7]) // => [7, 8, 9] 
process_double([5,6,7]) // => [10, 12, 14] 


看 另 一 个 例子 。 创建 一 个 buildMultiplier 画 数 ， 将 x 作为 输入 ， 然 后 一 
对 其 参数 x 相 乘 的 函数 : 
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var buildMultiplier = function(x) { 
return function(y) { 
return x * y; 


var double = buildMultiplier(2); 
var triple = buildMultiplier(3); 


double(3); // => 6 
triple(3); // => 9 


Exercise 


定义 一 个 ‘negate` 函数 将 "add1 作为 参数 ， 返 回 一 个 画 数 ,这 个 函数 通过 “add1 
返回 值 的 相反 数 .( 开 始 有 点 复杂 了 ) 


var add1 = function (x) { 
return x + 1; 


下 


var negate = function(func) { 
// TODO 


了 


// 应 该 返回 -6 
ZN (6 
negate(add1)(5); 
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对 象 
Javascript 的 原始 类 型 是 true ，false ,数字 , 字符 串 ，nu1l1 and 
undefined 。 所 有 其 他 值 都 是 对 象 . 


Javascript 对 象 包含 成 对 的 propertyName (属性 名 ) : propertyValue (属性 
值 ) 。 


创建 


There are two ways to create an object in JavaScript: 在 Javascript 中 ， 有 两 种 
方法 去 创建 一 个 对 象 


1. 字面 上 


var object = {0}; 
// 是 的 ， 简 单 是 使 用 一 对 大 括号 ! 


注意 : 这 是 推荐 的 方法 
2. 面向 对 象 


var object = new Object(); 


注意 : 这 很 像 Java 


属性 


对 象 的 属性 是 一 对 的 propertyName( 属 性 名 ) : propertyValue( 属 性 值 ) ， 属 性 
的 名 字 只 能 是 字符 串 。 如 果 不 是 字符 串 ， 将 会 转换 为 字符 串 。 可 以 在 创建 对 象 或 之 
后 初始 化 属性 。 


var language = { 
name: "JavaScript '， 
isSupportedByBrowsers: true, 
createdIn: 1995, 
author:{ 
firstName: 'Brendan', 
lastName: 'Eich' 
}, 
// 是 的 ， 对 象 可 以 藤 套 1 
getAuthorFullName: function(){ 
return this.author.firstName + " " + this.author.lastName; 





} 
// 是 的 ， 了 落 数 可 以 有 值 ! 
}; 


贺 了 鹏 "| 


以 下 代码 展示 如 何 获取 属性 的 值 。 


var Variable = language.name; 


bn 


// 变量 包含 字符 串 "JavaScript" 





variable = language['name']; 

// 这 行 代码 和 上 行 功能 一 样 。 不 同 之 处 在 于 这 行 代 码 业 书面 化 的 字符 串 作为 属性 名 ， 不 i 
variable = language.newProperty; 

// 变量 没 定 义 ， 因 为 该 属性 没 赋值 。 














一 一 一 





以 下 代码 展示 如 何 添加 一 个 新 属性 或 改变 一 个 存在 的 属性 。 
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language.newProperty = 'new Value 

// 现在 对 象 有 一 个 新 的 属性 。 如 果 该 属性 已 经 存在 ， 值 将 会 被 蔡 换 。 
language['newProperty'] = 'changed value'; 

// 两 以 上 种 方法 都 可 以 使 用 ， 更 推荐 第 一 种 (使 用 `，`)。 


属性 
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可 变性 
对 象 与 原始 值 不 同 之 处 在 于 对 象 可 以 改变 ， 原 始 值 是 不 可 变 的 。 


var myPrimitive = "first value"; 
myPrimitive = "another value",; 
// myPrimitive 现 在 指向 另 一 个 字符 串 
Var myobject = { key: "first value"}; 
myObject.key = "another value",; 
// my0bject 指向 的 还 是 原来 的 对 象 


对 象 是 不 会 被 复制 的 。 它 们 的 传递 靠 引用 。 


// 假设 我 有 一 个 匹 萨 
Var myPizza = {slices: 5}; 

// 然后 我 和 你 分 享 它 
Var yourPizza = myPizza; 

V7 eal TAN 
myPizza.slices = myPizza.slices - 1; 
var numberofSlicesLeft = yourPizza.slices; 
// 我 们 总 共有 4 片 

// 因为 我 们 引用 了 同一 块 匹 萨 

var a= {}, b= {}, c= {}; 

// ab， 和 c 都 引用 不 同 的 空 对 象 
a=b=c= {}; 

// ab， 和 c 都 引用 同一 个 空 对 象 


原型 


每 个 对 象 都 与 对 象 原型 关联 ， 继 承 了 对 象 原型 的 属性 。 


所 有 对 象 创建 时 都 从 字面 量 对 象 ( {} ) 继承 ， 且 都 自动 链接 到 的 
Object.prototype，Object.prototype 来 自 JavaScript 标 准 。 

当 JavaScript 解 释 器 〈 在 浏览 器 中 一 个 模块 ) ， 试 图 找到 一 个 属性 ， 它 要 检索 ， 如 
下 面 的 代码 : 


var adult = {age: 26}, 
retrievedProperty = adult .age; 


/ / > .二 己 Ss 
L001 三 各 相合 


首先 ， 解 释 器 检查 对 象 有 的 每 个 属性 。 例 如 ， adult 只 有 一 个 自己 的 属性 - 
age 。 但 是 ， 除 此 之 外 ， 实 际 上 还 有 几 个 属性 ， 这 是 继承 自 Object.prototype。 


var stringRepresentation = adult.toSstring(); 


LODjlecaobyiecal 


toString 是 一 个 Object.prototype 的 属性 , 这 是 继承 。 它 有 一 个 画 数 ， 返 回 值 为 
一 个 对 象 的 字符 串 。 如 果 希 望 它 返 回 一 个 更 有 意义 的 东西 ， 那 么 你 可 以 将 其 覆盖 。 
简单 的 添加 一 个 属性 到 adult 对 象 。 


adult.toString = function(){ 
return "Im "+this.age; 


} 


如 果 现 在 调用 toString 阔 数 ， 解 释 器 将 发 现 一 个 新 的 对 象 中 的 属性 然后 停止 。 
解释 器 解析 某 个 属性 时 会 先 检查 对 象 自己 ， 再 进一步 检查 他 的 原型 。 


要 设置 自己 的 对 象 为 原型 而 不 是 默认 的 Object.prototype， 你 可 以 调用 以 下 
的 object,create : 


Es 


可 avVaScCh bp 【和 于 于 


var child = Object.create(adult); 
/* 通过 这 种 方式 创建 的 对 象 可 以 让 我 们 轻松 替换 默认 的 0bject .prototype 成 我 们 想 要 
4h 
child.age = 8; 
/* 在 此 之 前 ，child 根 本 没有 自己 的 年 龄 属性 ， 解 释 器 会 寻找 child 的 原型 中 是 否 有 该 
注意 : adu1t 的 年 龄 仍 为 26。 
EB 
var stringRepresentation = child.tostring(); 
WL MI EN ee 
/* 注意 : 我 们 没 覆 盖 child 的 toString 属 性 ， 因 此 adult 类 函数 不 会 被 调用 。 如 果 adu 
yf 


-| 网 


child ' 的 原型 是 adult ， 其 原型 为 0bject .prototype 。 这 一 系列 原型 被 称 为 
原型 链 。 





销毁 


delete 被 用 来 从 一 个 对 象 中 删除 一 个 属性 。 它 将 删除 对 象 中 的 一 个 存在 属性 ， 
使 其 不 再 存在 于 原型 链 中 。 从 一 个 对 象 中 删除 一 个 属性 就 是 将 改 属性 从 原型 中 移 
出 : 


var adult = {age:26}, 
child = Object.create(adult); 
child.age = 8; 


delete child.age; 

/* 从 chil1d 中 删除 age 属性 ， 表 明 这 之 后 该 属性 不 在 被 覆盖 */ 
Var prototypeAge = child.age; 

// 26， 因 为 该 孩子 没有 自己 的 age 属性 。 



































枚 举 
for in 语句 可 以 台历 对 象 中 所 有 的 属性 。 枚 举 包括 函数 和 原型 属性 。 


Var fruit = { 
apple: 2, 
orange:5, 
pear:1 
}, 
sentence = 'I have ', 
quantity; 
for (kind in fruit)t{ 
quantity = fruit[kind]; 
Sentence += quantity+' ‘+kind+ 
(quantity===1?'':'S')+ 


1 1 。 
这 大 


} 
.Tne following Jine removes the trailing comat 


sentence = sentence.substr(0,sentence.length-2)+"'.'; 
nave 2appleses oranges near 


全 局 化 


如 果 想 开发 一 个 模块 ， 它 可 以 在 网 页 上 运行 或 也 可 以 运行 其 他 模块 ， 因 此 你 必须 注 
意 变量 名 是 否 重复 。 


假设 我 们 正在 卡 开发 一 个 计数 器 模块 : 


Var myCounter = { 
number : 0, 
plusPlus : function()t{ 
this.number : this.number + 1; 
}, 
isGreaterThanTen : function(){ 
return this.number > 10; 


注意 : 这 个 技巧 通常 配合 闭 包 使 用 ， 以 使 来 自 外 部 的 内 部 状态 不 变 。 


模块 使 用 唯一 一 个 变量 名 一 mycounter 。 如 果 其 他 模块 使 用 名 字 比 如 number 
或 isGreaterThanTen ， 这 样 就 会 很 安全 ， 因 为 不 会 覆盖 每 个 其 他 的 值 。 


